<!DOCTYPE html>
<html class="um landscape min-width-240px min-width-320px min-width-480px min-width-768px min-width-1024px">
<head>
    <title></title>
    <meta charset="utf-8">
    <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
    <link rel="stylesheet" href="css/fonts/font-awesome.min.css">
    <link rel="stylesheet" href="css/ui-box.css">
    <link rel="stylesheet" href="css/ui-base.css">
    <link rel="stylesheet" href="css/ui-color.css">
    <link rel="stylesheet" href="css/appcan.icon.css">
    <link rel="stylesheet" href="css/appcan.control.css">
    <link rel="stylesheet" href="news_detail/css/news_detail.css">
</head>
<body class="" ontouchstart>
<div class="bc-bg" tabindex="0" data-control="PAGE" id="Page">
    <!--header开始-->
    <div class="uh bc-head  ubb bc-border" data-control="HEADER" id="Header">
        <div class="ub">
            <div class="nav-btn" id="nav-left">
                <div class="fa fa-angle-left fa-2x"></div>
            </div>
            <h1 class="ut ub-f1 ulev-3 ut-s tx-c" tabindex="0">新闻详情</h1>
            <div class="nav-btn nav-bt" id="favoriteBtn" style="margin-right: 0.5em;">
                <div class="fa fa-heart-o"></div>
            </div>
            <div class="nav-btn nav-bt" id="nav-right">
                <div class="fa fa-share-alt" id="shareBtn"></div>
            </div>
        </div>
    </div>
    <!--header结束-->
    
    <!--content开始-->
    <div id="content" class="ub-f1 tx-l">
        <div class="scrollbox">
            <!-- 新闻图片 -->
            <div class="news-image-container">
                <img id="newsImage" src="index/css/myImg/newsImg1.png" alt="新闻图片" class="news-image">
                <div class="news-image-overlay"></div>
            </div>
            
            <!-- 新闻标题 -->
            <div class="news-header">
                <h1 class="news-title" id="newsTitle">加载中...</h1>
                <div class="news-meta">
                    <span class="news-source" id="newsSource">来源</span>
                    <span class="news-divider">•</span>
                    <span class="news-time" id="newsTime">时间</span>
                </div>
            </div>
            
            <!-- 新闻内容 -->
            <div class="news-content-wrapper">
                <div class="news-content" id="newsContent">
                    <p>正在加载新闻内容...</p>
                </div>
            </div>
            
            <!-- 评论区 -->
            <div class="comment-section">
                <div class="comment-header">评论</div>
                
                <!-- 评论输入框 -->
                <div class="comment-input-section" id="commentSection">
                    <!-- 未登录状态 -->
                    <div id="loginPrompt" class="login-prompt-section">
                        <div class="login-prompt-text">
                            <h3>登录后参与评论</h3>
                            <p>登录后可以发表评论，与其他用户交流讨论</p>
                        </div>
                        <div class="login-buttons">
                            <button id="goToLoginBtn" class="go-to-login-btn">去登录</button>
                        </div>
                    </div>
                    
                    <!-- 已登录状态 - 评论输入 -->
                    <div id="commentInputSection" style="display: none;">
                        <div class="user-info">
                            <span class="current-user">当前用户：<span id="currentUsername">未登录</span></span>
                            <button id="logoutBtn" class="logout-btn">
                                <i class="fa fa-sign-out" style="margin-right: 4px;"></i>退出登录
                            </button>
                        </div>
                        <textarea id="commentInput" placeholder="写下你的评论..." rows="3"></textarea>
                        <div class="comment-submit-area">
                            <button id="submitComment">发表评论</button>
                        </div>
                    </div>
                </div>
                
                <!-- 评论列表 -->
                <div id="commentList">
                    <!-- 动态加载评论 -->
                </div>
            </div>
        </div>
    </div>
    <!--content结束-->
</div>

<script src="js/appcan.js"></script>
<script src="js/appcan.control.js"></script>
<script src="js/appcan.scrollbox.js"></script>
<script src="js/news_detail.js"></script>
</body>
</html> 